<!doctype html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>管理员登录</title>
    <link rel="stylesheet" href="../../dist/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="../../css/styles.css">
    <script src="../../js/jquery.min.js"></script>
    <script src="../../dist/js/bootstrap.js"></script>
</head>
<body>
<div class="jq22-container" style="padding-top:50px">
    <div class="login-wrap">
        <div class="login-html">
            <p class="login-title">洗衣店管理员登录</p>
            <input id="tab-1" type="radio" name="tab" class="sign-in" checked ><label for="tab-1" class="tab">登录</label>
            <input id="tab-2" type="radio" name="tab" class="sign-up"><label for="tab-2" class="tab"style="display: none">注册</label>
            <div class="login-form">
                <div class="sign-in-htm">
                    <div class="group">
                        <label for="login_user" class="label">用户名:</label>
                        <input id="login_user" type="text" class="input">
                    </div>
                    <div class="group">
                        <label for="login_pass" class="label">密码:</label>
                        <input id="login_pass" type="password" class="input" data-type="password">
                    </div>
                    <div class="group">
                        <input id="check" type="checkbox" class="check" checked>
                        <label for="check"><span class="icon"></span>记住我</label>
                    </div>
                    <p id="loginText"></p>
                    <div class="group">
                        <input type="button" id="loginBtn" class="button" value="Sign In">
                    </div>
                    <div class="hr"></div>
                    <div class="foot-lnk">
                        <a data-toggle="modal" data-target="#myModal">修改密码?</a>
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>

<!-- 修改密码模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"
     style="margin-top: 50px;">
    <div class="modal-dialog" style="width: 40%;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">修改密码</h4>
            </div>
            <div class="modal-body">
                <form class="fo" style="padding:0px 50px;">
                    <div class="form-group">
                        <input type="text" class="form-control" name="username" id="username" placeholder="请输入用户名"/>
                        <i class="fa fa-user"></i>
                    </div>
                    <div class="form-group">
                        <input type="password" class="form-control" name="passOld" id="passOld" placeholder="请输入原密码"/>
                        <i class="fa fa-lock"></i>
                    </div>
                    <div class="form-group">
                        <input type="password" class="form-control" name="passNew" id="passNew" placeholder="请输入新密码"/>
                        <i class="fa fa-lock"></i>
                    </div>
                </form>
                <span id="infoU"></span>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary"id="update">确认修改</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
<script src="../../js/jquery.cookie.js"></script>
<script type="text/javascript">
    $(function () {

        //cookie
        if ($.cookie("remember") == "true") {
            $("#check").attr("checked", true);
            $("#login_user").val($.cookie("username"));
            $("#login_pass").val($.cookie("password"));
        }
        ;

        $("#loginBtn").click(function () {

            var loginVo = {
                username: $("#login_user").val(),
                password: $("#login_pass").val(),
            };
            $.ajax({
                type: "post",
                url: "/system/login",
                dataType: "json",
                contentType: "application/json;charset=utf-8",
                data: JSON.stringify(loginVo),
                success: function (data) {
                    if (data.code != 0) {
                        $("#loginText").html(data.msg);
                        $("#loginText").css("color", "red");
                    } else {
                        Save();
                        window.location.href = data.data;
                    }
                }
            });
        });



        $("#update").click(function () {
            var updateVo = {
                userNew: $("#username").val(),
                passOld : $("#passOld").val(),
                passNew: $("#passNew").val()
            };
            $.ajax({
                type: "post",
                url: "/system/update",
                dataType: "json",
                contentType: "application/json;charset=utf-8",
                data: JSON.stringify(updateVo),
                success: function (data) {
                    if (data.code == "0"){
                        $("#infoU").html("更改成功");
                        $("#infoU").css("color","green");
                    } else {
                        $("#infoU").html(data.msg);
                        $("#infoU").css("color","red");
                    }
                }
            });
        });

        $(".foot-lnk a").click(function () {
            $("#username").val("");
            $("#passOld").val("");
            $("#passNew").val("");
            $("#infoU").html("");
        });
    });

    //记住用户名密码
    function Save() {
        if ($("#check").is(":checked")) {
            var str_username = $("#login_user").val();
            var str_password = $("#login_pass").val();
            $.cookie("remember", "true", {expires: 7}); //存储一个带7天期限的cookie
            $.cookie("username", str_username, {expires: 7});
            $.cookie("password", str_password, {expires: 7});
        }
        else {
            $.cookie("remember", "false", {expire: -1});
            $.cookie("username", "", {expires: -1});
            $.cookie("password", "", {expires: -1});
        }
    };
</script>

</body>
</html>